<template>
  <div id="contacts">
    <div id="pgcontainer1">
      <!--头部的开始-->
      <header>
        <strong>Contacts</strong>
      </header>
      <!--头部的结束-->
      <!--主题内容的开始-->
      <div class="zymain">
        <div class="zybt"><strong>Friend List</strong></div>
        <!--更换内容开始-->
        <div class="ltgd_nr">
          <ul>
            <li v-for="user  in users" >
              <router-link  :to="'/chartContent/'+user.id" >
                  <div class="lzj"><img src="../assets/images/shouji_37_2.jpg"/></div>
                  <h3>{{ user.userName }}</h3>
                  <p>Friend Personalized Signature</p>
              </router-link>
            </li>
            <div class="clear"></div>
          </ul>
        </div>
        <!--更换内容结束-->
      </div>
      <!--主题内容的结束-->

      <!--底部的开始-->
      <div class="lbottom">
        <p>Copryrught@2015-2020 property in copyright <a href="" target="_blank">Pay</a><br/>
          Address：Xxx-xxx-xxx-xxx-xxx</p>
      </div>
      <!--底部的结束-->
      <div class="dbgao"></div>
    </div>
  </div>

</template>
<script>
  import Sweetalert from '../assets/js/sweetalert-dev'
  import HeaderView from '../components/Header.vue';

  export default{
    mounted(){
      this.getFriends();
    },
    data(){
      return {
        users: {}
      }
    },
    methods: {
      getFriends(){
        var post = this;
        this.$http.jsonp(global.URL + "/getFriends", //跨域请求接口
          {
            params: {}
          }).then(function (response) {
          this.users = response.data;

          if (response.data == "0") {
            swal("OMG", "Please login!", "error");
            post.$router.replace({path: '/login'})
          } else {

          }
        }, function (error) {
          swal("OMG", "Please login!", "error");
          post.$router.replace({path: '/login'})
        });
      }
    },
    components: {
      HeaderView,
    }
  }
</script>
<style>

  @import '../assets/css/ltkj.css';
  @import '../assets/css/sweetalert.css';
</style>

